<%--
  Created by IntelliJ IDEA.
  User: baijinbao
  Date: 2021/5/25
  Time: 8:49
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/layui/css/layui.css">
    <script src="${pageContext.request.contextPath}/layui/layui.js"></script>
</head>
<body id="body">

<%--店铺选择下拉框--%>
<div class="demoTable layui-form">
    <div class="layui-inline" style="margin-top: 15px">
        <div class="layui-form-item">
            <div class="layui-input-inline">
                <select id="branchidSel" name="branchid" lay-verify="required">

                </select>
            </div>
        </div>
    </div>
    <button class="layui-btn" id="reloadTabBtn" data-type="reload">搜索</button>
</div>

<table id="demo" lay-filter="test"></table>

<div id="divEle" style="display: none">
    <table id="tab" lay-filter="test2"></table>
</div>

<div id="divEle3" style="display: none">
    <h1 style="text-align: center;color: #C9A95C;" id="dianName"></h1>
    <table id="tab3" lay-filter="test3"></table>
</div>

<div id="divEle4" style="display: none">
    <table id="tab4" lay-filter="test4"></table>
</div>


<%--头部工具栏--%>
<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="add">新增入库</button>
        <button class="layui-btn layui-btn-sm" lay-event="getAllGoods">添加商品</button>
        <button class="layui-btn layui-btn-sm" lay-event="shuaxin">刷新</button>
    </div>
</script>


<script type="text/html" id="toolbarDemo2">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="tijiao">提交</button>
    </div>
</script>

<script type="text/html" id="toolbarDemo3">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="tianjia">添加</button>
    </div>
</script>



<%--右侧工具栏--%>
<script type="text/html" id="barDemo">
    {{#  if(d.status == 3){ }}
    <a class="layui-btn layui-btn-xs" lay-event="allAuditing" >详细信息</a>
    {{#  } else { }}
    <a class="layui-btn layui-btn-xs" lay-event="allAuditing">详细信息</a>
    {{#  } }}
</script>

<script type="text/html" id="titleTpl">
    {{#  if(d.status == 1){ }}
    <a class="layui-btn layui-btn-warm layui-btn-sm"  style="width: 70px">审核中</a>
    {{# } else if(d.status == 2){ }}
    <a class="layui-btn layui-btn-sm"  style="width: 70px">申请通过</a>
    {{#  } else { }}
    <a class="layui-btn layui-btn-danger layui-btn-sm"  style="width: 70px">申请驳回</a>
    {{#  } }}

</script>

<script>

    layui.use(['table','form','jquery','layer'], function(){
        var table = layui.table;
        var form = layui.form;
        var $ = layui.jquery;
        var layer = layui.layer;
        //框店铺选择下拉框
        $.ajax({
            url: '${pageContext.request.contextPath}/type/getAllType',//数据接口
            type: 'get',
            dataType: 'json',
            success: function (types) {
                console.log(types)
                $.each(types, function (i, obj) {
                    $("#branchidSel").append(
                        $("<option></option>").attr("value", obj.branchid).text(obj.branchname)
                    )
                })
                form.render('select');
            }
        })

        $("#reloadTabBtn").click(function (){
            table.reload('test',{
                where: { //设定异步数据接口的额外参数
                    bid:$("#branchidSel").val()
                }
                ,page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
        })
        //加载表格的实例
        table.render({
            id:"test",
            //elem element 元素---》表格的容器
            elem: '#demo'//table标签的id属性值
            //,height: 312//整个表格的高度
            ,url: '${pageContext.request.contextPath}/entry/getAllEntry' //数据接口
            ,dateType:"json"
            ,toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
            ,cols: [[ //表头
                {type: 'checkbox', fixed: 'left'}

                ,{field: 'id', title: '入库编号'}
                ,{field: 'date', title: '入库时间'}
                ,{field: 'status', title: '审核状态', templet:'#titleTpl'}
                ,{field: 'branch.staff.staffname', title:'操作员', templet: function (data) {
                        console.log(data);
                        return data.branch.staff.staffname;
                    }}
                ,{field: 'branch.branchname', title:'店名' ,templet: function (data) {
                        console.log(data);
                        return data.branch.branchname;
                    }}
                ,{field: 'dates', title: '审核时间'}
                ,{field: 'remark',title: '驳回理由'}
                ,{fixed: 'right', title:'操作',width:200, toolbar: '#barDemo' },

            ]],
            text: {
                none: '暂无相关数据' //默认：无数据。
            },
            initSort: {
                field: 'id' //排序字段，对应 cols 设定的各字段名
                ,type: 'desc' //排序方式  asc: 升序、desc: 降序、null: 默认排序
            },
            page:true,//开启分页
            limit:5,//默认每页显示的条数
            limits:[5,10,15,20]//自定义分页条数的选择
        });
        /*商品下拉框*/
        $.ajax({
            url: '${pageContext.request.contextPath}/type/getAllShop',//数据接口
            type: 'get',
            dataType: 'json',
            success: function (types) {
                console.log(types);
                //将查到的店铺类型信息填充到类型下拉框中

                $.each(types, function (i, obj) {
                    console.log(obj.branchid + "111");
                    $("#searchBranch").append(
                        $("<option></option>").attr("value", obj.branchid).text(obj.branchname)
                    )
                })
                //执行表单的更新渲染方法
                form.render('select');

                /*$.each(types,function (i, obj) {

                })*/
            }
        })
        //头工具栏事件
        //toolbar()括号中的参数就是  table容器中 lay-filter属性的值
        table.on('toolbar(test)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
                /**
                 * case后边的具体字符串跟 toolbarDemo中的 lay-event属性值一样
                 */
                case 'add':
                    //先执行清空表单的方法，再打开弹出框

                    /*$("#jiuForm")[0].reset();*/
                    layer.open({
                        type: 1,
                        content: $("#divEle3"), //这里content是一个普通的String
                        area: ['1180px','680px'],
                        offset: 't'
                    });

                    var dianName =$("#searchBranch").find("option:selected").text()
                    $("#dianName").html(dianName)
                    table.render({
                        id:"test3",
                        //elem element 元素---》表格的容器
                        elem: '#tab3'//table标签的id属性值
                        //,height: 312//整个表格的高度
                        ,url: '${pageContext.request.contextPath}/entry/getAllShoping' //数据接口
                        ,dateType:"json"
                        ,toolbar: '#toolbarDemo2'
                        ,cols: [[ //表头
                            {type: 'checkbox', fixed: 'left'}
                            ,{field: 'goodsid', title: 'ID',hide:true}
                            ,{field: 'goodsname', title: '商品名'}
                            ,{field: 'layout', title: '类型名称'}
                            ,{field: 'shafttype', title:'键轴'}
                            ,{field: 'interfacetype', title:'接口'}
                            ,{field: 'cprice', title: '进价'}
                            ,{field: 'branch.branchid', title: '店id',hide:true ,templet: function (data) {
                                    console.log(data);
                                    return data.branch.branchid;
                                }}
                            ,{field: 'branch.branchname', title: '店名',templet: function (data) {
                                    console.log(data);
                                    return data.branch.branchname;
                                }}
                            ,{field: 'staffid', title: '员工id',hide:true ,templet: function (data) {
                                    console.log(data);
                                    return data.staffid;
                                }}
                            ,{field: 'bgoods.counts', title:'库存',templet: function (data) {
                                    console.log(data);
                                    return data.bgoods.counts;
                                }}
                            , {field: 'num',  title: '入库量',edit:'text'}
                        ]],

                        text: {
                            none: '暂无相关数据' //默认：无数据。
                        },
                        where:{
                            bId:$("#branchidSel").val()
                        },
                        page:true,//开启分页
                        limit:5,//默认每页显示的条数
                        limits:[5,20,30,100]//自定义分页条数的选择
                    });

                    break;
                case 'shuaxin':
                    table.reload("test");
                    break;
                case 'getAllGoods':
                    layer.open({
                        type: 1,
                        content: $("#divEle4"), //这里content是一个普通的String
                        area: ['1180px','680px'],
                        offset: 't'
                    });
                    table.render({
                        id:'test4',
                        elem: '#tab4'
                        ,url:'${pageContext.request.contextPath}/goods/Goods'
                        ,toolbar: '#toolbarDemo3' //开启头部工具栏，并为其绑定左侧模板
                        ,title: '用户数据表'
                        ,text: {
                            none: '该分店还没有商品～' //默认：无数据。
                        }
                        ,cols: [[
                            {type: 'checkbox', fixed: 'left'}
                            ,{field:'goodsid', title:'商品编号',fixed: 'left',hide:true/*,templet:function (data){
                    return data.branch_goods.goodsid
                    }*/}
                            ,{field:'url', title:'商品图片',height:50,templet:function (data) {
                                    var a=data.url
                                    return "<Img src='"+a+"' style='width: 100px;height: 50px'>"
                                }}
                            ,{field:'goodsname', title:'商品名称'}
                            ,{field:'layout', title:'键盘布局'}
                            ,{field:'keycap', title:'键帽材质',templet: function (data) {
                                    //console.log(data);
                                    return data.keycap==null?"":data.keycap.keycapname;
                                }}
                            ,{field:'keyboardcolor', title:'键盘颜色',templet: function (data) {
                                    //console.log(data);
                                    return data.keyboardcolor==null?"":data.keyboardcolor.keyboardcolorname;
                                }}
                            ,{field:'shafttype', title:'轴体类型'}
                            ,{field:'shaftchoose', title:'轴体选择',templet: function (data) {
                                    //console.log(data);
                                    return data.shaftchoose==null?"":data.shaftchoose.shaftchoose;
                                }}
                            ,{field:'interfacetype', title:'接口类型'}
                            ,{field:'backlightcolor', title:'背光颜色',templet: function (data) {
                                    //console.log(data);
                                    return data.backlightcolor==null?"":data.backlightcolor.backlightcolorname;
                                }}
                            ,{field:'cprice', title:'商品进价'}
                            ,{field:'sprice', title:'商品售价'}

                        ]]
                        ,page: true
                        ,limit:8
                        ,limits:[8,16,24]
                    });
                    break;
            };
        });

        $("#jiuSearch").click(function () {
            table.reload('test', {
                where: { //设定异步数据接口的额外参数，任意设
                    id:$("#searchBranch").val()
                },page: {
                    curr: 1 //重新从第 1 页开始
                }
            }); //只重载数据
        })

        table.on('toolbar(test3)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event) {
                /**
                 * case后边的具体字符串跟 toolbarDemo中的 lay-event属性值一样
                 */
                case 'tijiao':
                    /*var data = checkStatus.data;
                    var flag=1;
                    $.each(data,function (i,val) {
                        var num =val.num;
                        if (num=='' || isNaN(num)||!(/(^[1-9]\d*$)/.test(num))){
                            flag=0;}
                    })*/
                    var data = checkStatus.data;
                    var flag=1;
                    var aaa=${sessionScope.staff.branchid};
                    $.each(data,function (i,val) {
                        var num =val.num;
                        var branchid= val.branch.branchid;
                        if(branchid!=aaa){
                            flag=0;
                            layer.msg("对不起,你没有权限入库该商品")
                        }
                        if (num=='' || isNaN(num)||!(/(^[1-9]\d*$)/.test(num))){
                            flag=0;
                            layer.msg("请检查你的数据格式")
                        }
                    })
                    if (flag==1){
                        var allEntry = JSON.stringify(data)
                        $.ajax({
                            url:'${pageContext.request.contextPath}/entry/addAllEntry',
                            type:"POST", //如果想以json格式把数据提交到后台的话，这个必须有，否则只会当做表单提交
                            data: {"allEntry":allEntry},//JSON.stringify()必须有,否则只会当做表单的格式提交
                            success:function (result) {
                                layer.closeAll();
                                if (result.code == 1) {
                                    //重载表格
                                    table.reload("test");
                                    layer.msg(result.msg);
                                } else {
                                    layer.msg(result.msg);
                                }
                            }
                        })
                    }/*else {
                        layer.msg("请检查数据格式！")
                    }*/
                    break;
            }
        });

        table.on('toolbar(test4)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event) {
                /**
                 * case后边的具体字符串跟 toolbarDemo中的 lay-event属性值一样
                 */
                case 'tianjia':
                    var data = checkStatus.data;
                    var allGoods = JSON.stringify(data)
                    $.ajax({
                        url:'${pageContext.request.contextPath}/entry/addGoods',
                        type:"POST", //如果想以json格式把数据提交到后台的话，这个必须有，否则只会当做表单提交
                        data: {"allGoods":allGoods},//JSON.stringify()必须有,否则只会当做表单的格式提交
                        success:function (result) {
                            layer.closeAll();
                            if (result.code == 1) {
                                //重载表格
                                table.reload("test");
                                layer.msg(result.msg);
                            } else {
                                layer.msg(result.msg);
                            }
                        }
                    })
                    break;
            }
        });

        table.on('edit(test3)', function(obj){ //注：edit是固定事件名，test是table原始容器的属性 lay-filter="对应的值"
            var inbNum=obj.value; //得到修改后的值
            if (inbNum=='' || isNaN(inbNum)){
                layer.alert("请检查数据格式！")
            }
        });


        //监听行工具事件
        ////tool()括号中的参数就是  table容器中 lay-filter属性的值
        table.on('tool(test)', function(obj){
            //取出当前点击的行的数据
            var data = obj.data;
            if(obj.event === 'allAuditing'){
                layer.open({
                    type: 1,
                    area: ['800px', '550px'],
                    offset: '100px',
                    content: $("#divEle")
                });
                var allMoneyNuma=0;
                table.render({
                    id:"test2"
                    //elem element 元素---》表格的容器
                    ,elem: '#tab'//table标签的id属性值
                    //,height: 312//整个表格的高度
                    ,url: '${pageContext.request.contextPath}/entry/getAllWarehousings' //数据接口
                    ,text: {
                        none: '暂无入库详情信息～' //默认：无数据。
                    }
                    ,cols: [[ //表头
                        {field: 'id', title: '入库编号'}
                        ,{field: 'goodsid', title: '商品id'}
                        ,{field: 'goodsname', title: '商品名称'}
                        ,{field: 'num', title: '入库数量'}
                        ,{field: 'cprice', title: '进价'}
                        ,{field: 'branchid', title: '店铺编号',hide:true}
                        ,{field: 'branchname', title: '所属分店'}
                        ,{field: 'zongjia', title: '总价',templet: function (data) {
                                return data.num*data.cprice;
                            }}
                    ]],

                    where: {
                        id: data.id,
                        /* branchid:$("#searchBranch").val()*/
                    }
                });
            }
            /*重新修改状态为审核中*/
            else if(obj.event === 'chongxin'){
                layer.confirm('真的要重新申请吗？', function(index){
                    $.ajax({
                        url:"${pageContext.request.contextPath}/audit/update",
                        type:"POST",
                        data:{"id": data.id, "status": data.status},
                        success:function (result) {
                            layer.closeAll();
                            if (result.code == 1) {
                                //重载表格
                                table.reload("test");
                                layer.msg(result.msg);
                            } else {
                                layer.msg(result.msg);
                            }
                        }
                    })
                })
            }else if(obj.event === 'tianjia'){
                $.ajax({
                    url:"${pageContext.request.contextPath}/entry/addGoods1",
                    type:"POST",
                    data:data,
                    success:function (result) {
                        layer.closeAll();
                        if (result.code == 1) {
                            //重载表格
                            table.reload("test");
                            layer.msg(result.msg);
                        } else {
                            layer.msg(result.msg);
                        }
                    }
                })
            };
        });


        table.on('edit(test3)', function(obj){ //注：edit是固定事件名，test是table原始容器的属性 lay-filter="对应的值"
            //得到修改后的值
            var name = obj.field; //当前编辑的字段名
            var data = obj.data;
            var invNum=obj.value;
            if (invNum==''||isNaN(invNum)||invNum<0){
                $(this).val(0)
                layer.msg("请检查数据格式！")
            }
        });

    });
</script>
</body>
</html>
